(<template>
<div>
    <ul>
        <li v-for="(item,index) in props.List" :key="index">
            {{item.name}}--{{item.age}}
        </li>
    </ul>
</div>
</template>

<script setup lang="ts">
//define前缀的是宏函数，一般不用引入，如Ref文件中的defineExpose
import {defineProps} from 'vue'
import { withDefaults } from 'vue';
import {type PersonInterface,type PersonsType } from '../types';
// 只接收list
// defineProps(['list'])

// 接收list + 限制类型
// defineProps<{List: PersonsType}>()//父类必须传值
// defineProps<{List?: PersonsType}>()//可选传值

// 接收list + 限制类型 + 限制必要性 + 指定默认值,屎
const props = withDefaults(defineProps<{List?: PersonsType}>(),{List:()=>
    [
    {name:'wang',age:18}

]});
console.log("props",props);
console.log("List",props.List);
</script>

<style scoped>

</style>
)